<template>
    <div-row :obj="obj" class="content-wrapper text-picture">
        <el-row :gutter="obj.gutter">
            <el-col :span="24/obj.columns" v-for="(item,index) in obj.imgTextBox" :key="index">
                <div class="card-box" :class="obj.animateImg? 'wow '+obj.animateImg : ''" @click="goClick(item.httpUrl)">
                    <div class="hd" :style="{backgroundColor: item.backgroundColor,backgroundImage: `url(${item.imgUrl})`}">
                        <h2 class="hd-title" v-html="item.title"/>
                        <p class="hd-desc" v-html="item.desc"/>
                    </div>
                    <div class="text-box">
                        <div class="info" v-html="item.info"/>
                        <div class="text-center"><el-button :style="{backgroundColor: item.backgroundColor,color: '#fff' }" round>了解更多</el-button></div>
                    </div>
                </div>
            </el-col>
        </el-row>
    </div-row>
</template>
<script>
import animate from '@/mixins/animate'
export default {
    name: 'ThreeColumns3',
    mixins: [animate]

}
</script>
